/*
@description  移动端公共样式 
@description  通用样式 
*/
/* 弹性布局 */
.kl-flex{display:flex}
.kl-flex-row{display:flex;flex-direction:row}
.kl-flex-col{display:flex;flex-direction:column}
.kl-flex-bet{justify-content:space-between}
.kl-flex-start{justify-content:flex-start}
.kl-flex-end{justify-content:flex-end}
.kl-flex-aro{justify-content:space-around}
.kl-flex-eve{justify-content:space-evenly}
.kl-flex-item-bottom{align-items:flex-end}
.kl-flex-item-center{align-items:center}
.kl-flex-row-center{justify-content:center}
.kl-flex-center{justify-content:center;align-items: center}
.kl-flex-wrap{flex-wrap:wrap}
/* 定位 */
.kl-pos-ab{position:absolute}
.kl-pos-re{position:relative}
.kl-pos-fix{position:fixed}
/* 水平 */
.kl-txt-center{text-align:center}
.kl-txt-left{text-align:left}
.kl-txt-right{text-align:right}
/* 垂直居中 */
.kl-vertical-box{display:table}
.kl-vertical{vertical-align:middle;display:table-cell}
.kl-vertical-middle{vertical-align:middle}
.kl-vertical-bottom{vertical-align:bottom;display: table-cell;}
/* 浮动 */
.kl-float-r{float:right}
.kl-float-l{float:left}
/* 文字行数 */
// 单行
.kl-font-limit-one{white-space:nowrap;overflow:hidden;-webkit-line-clamp:1;text-overflow:ellipsis;}
// 多行
.kl-font-limits-one{overflow: hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient: vertical;}
.kl-font-limits-two{overflow: hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;}
.kl-font-limits-three{overflow: hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient: vertical;}
/* 文本 */
.kl-txt-break{word-break:break-all}
.kl-txt-no-style-input{outline:none;border:none;background: transparent}
/* 下划线 */
.kl-txt-underline{text-decoration: underline;}
/* 分割线 */
.kl-cutline{border-bottom: 1px solid rgba(204,204,204,0.4);width:100%;height:1px;}
/* 模糊 */
.kl-fliter{-webkit-filter: blur(4px);filter: blur(4px);}
/* 滑动展示 */
// 横向可滑动
.kl-row-slide{display: -webkit-box;overflow-x: scroll;-webkit-overflow-scrolling: touch;}
// 纵向滑动
.kl-line-slide{overflow-y: scroll;}
// 颜色定义
// 文字
$color-rain-line:#ebedf0;
$color-rain-title:#999999;
//分割线
hr{ height:1px;border:none;border-top:1px solid $color-rain-line }
//遮罩层
.kl-cover-box{
	position: fixed;
	z-index: 1000;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	background-color: rgba(0, 0, 0, 0.4);
}

/* 布局样式 */
.show-title{
  text-align: left;
  font-size: 14px;
  padding: 16px;
  color: $color-rain-title;
}
.show-list{
  background-color: #ffffff;
  border-radius: 4px;
  margin: 0 16px;
  box-shadow: 0 0 2px 2px rgba($color: #cccccc, $alpha:0.1);
  padding: 10px 8px;
  .show-item{
    padding: 8px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    div:nth-child(2){
      color: $color-rain-title;
    }
  }
}

